<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <h3></h3>
    <script>
      // 利用 Date 日期，判断当前打开页面的时间是早上（0:00 ~ 12:00）， 下午(12: 00 ~ 17: 00)， 还是晚上(17:00 ~ 24:00)，然后分别弹出对应的问候语： 早上就是`该起床了`,  中午就是`该吃饭了`，晚上就是`该休息了`  （提示： 考查日期对象的获取小时方法， 以及多分支 if 语句使用）

      //1.获取 h3
      const h3 = document.querySelector("h3");
      // 2. 初始化调用一次(立即显示时间)

      // 渲染时间

      let h;
      let m;
      let s;
      function renderTime() {
        // 2.实例化对象
        const dt = new Date();

        // 3.获取 年月日 时分秒
        // const y = dt.getFullYear();
        // let M = dt.getMonth() + 1;
        // let d = dt.getDate();
        h = dt.getHours();
        m = dt.getMinutes();
        s = dt.getSeconds();

        // 6.数字补零
        // M = M >= 10 ? M : "0" + M;
        // d = d >= 10 ? d : "0" + d;
        // h = h >= 10 ? h : "0" + h;
        // m = m >= 10 ? m : "0" + m;
        // s = s >= 10 ? s : "0" + s;

        // 4.拼接字符串
        // const timeStr = `${y}-${M}-${d} ${h}:${m}:${s}`;
        const timeStr = ` ${h}:${m}:${s}`;

        // 5.给 h3 的innerText 赋值
        h3.innerText = timeStr;
      }

      renderTime();
      setInterval(renderTime, 1000);

      console.log(h);
      if (h < 12) {
        alert`早上好小伙子`;
      } else if (h < 17) {
        alert`中午好小伙子`;
      } else {
        alert`晚上好小伙子`;
      }
    </script>
  </body>
</html>
